{% extends "base.html" %}
{% load i18n %}
<body>
{% block detail %}

    <div class="main">
        <div class="ucWrap">
            <div class="ucSide">
                <h2>{% trans 'Accounts' %}</h2>
                <ul>
                    <li><a href="/my/home/">&gt; {% trans 'Browsed Cases' %}</a></li>
                    <li><a href="/my/favor/">&gt; {% trans 'Saved Cases' %}</a></li>
                    <li><a href="/my/case/">&gt; {% trans 'My Cases' %}</a></li>
                    <li class="cur"><a href="/my/setting/">&gt; {% trans 'Account' %}</a></li>
                    <li><a href="/my/password/change/">&gt; {% trans 'Change password' %}</a></li>
                </ul>
            </div>
            <div class="ucMain">
                <h2><span><b>{% trans 'Account' %}</b></span></h2>

                <div id="validate" class="worn">
                    {% if message %}
                        {{ message }}
                    {% endif %}
                </div>
                <form class="nice" method="POST" id="settingForm" action="/my/setting/">{% csrf_token %}
                    <dl class="dl_txt clearfix">
                        <dt>{% trans 'Username' %}：</dt>
                        <dd><input name="username" id="username" value="{{ user.username }}" class="text"/></dd>
                    </dl>
                    <dl class="dl_txt clearfix">
                        <dt>{% trans 'Email' %}：</dt>
                        <dd><input name="email" id="email" value="{{ user.email }}" class="text"/></dd>
                    </dl>
                    <div class="dl_btn"><input type="button" onclick="check()" value="{% trans 'Update' %}"/></div>

                </form>


            </div>
        </div>
    </div>

{% endblock %}

{% block js %}
    <script>
        function check() {
            if ($("#username").val() == '') {
                $("#validate").empty();
                {% ifequal LANGUAGE_CODE 'zh-cn' %}
                    $("#validate").html("昵称为必需项!");
                {% else %}
                    $("#validate").html("The nickname is required!");
                {% endifequal %}
                return false;
            }
            if ($("#username").val().length > 30) {
                $("#validate").empty();
                {% ifequal LANGUAGE_CODE 'zh-cn' %}
                    $("#validate").html("昵称不超过30个字符!");
                {% else %}
                    $("#validate").html("The nickname is not more than 30 characters!");
                {% endifequal %}
                return false;
            }
            if ($("#email").val() == '') {
                $("#validate").empty();
                {% ifequal LANGUAGE_CODE 'zh-cn' %}
                    $("#validate").html("邮箱为必需项!");
                {% else %}
                    $("#validate").html("The email is required!");
                {% endifequal %}
                return false;
            }

            $("#settingForm").submit();
        }
    </script>
{% endblock %}

</body>
</html>